<template>
  <div>
    <el-table :data="newList" border style="width: 100%">
      <el-table-column prop="number" label="考试编号" width="150">
      </el-table-column>
      <el-table-column prop="subject" label="学科" width="120">
      </el-table-column>
      <el-table-column prop="catalog" label="目录" width="120">
      </el-table-column>
      <el-table-column label="题型" width="120">
        <template slot-scope="{ row }">
          {{ typList[row.questionType] ? typList[row.questionType].label : '' }}
        </template>
      </el-table-column>
      <el-table-column label="题干" width="300">
        <template slot-scope="{ row }">
          <div v-html="row.question"></div>
        </template>
      </el-table-column>
      <el-table-column label="录入时间" width="100">
        <template slot-scope="{ row }">
          {{ row.addDate | forMat('YYYY-MM-DD hh:mm:ss') }}
        </template>
      </el-table-column>
      <el-table-column label="难度" width="120">
        <template slot-scope="{ row }">
          {{ difList[row.difficulty] ? difList[row.difficulty].label : '' }}
        </template>
      </el-table-column>
      <el-table-column prop="creator" label="录入人" width="120">
      </el-table-column>
      <el-table-column label="审核状态" width="120">
        <template slot-scope="{ row }">
          {{ chkList[row.chkState] ? chkList[row.chkState].label : '' }}
        </template>
      </el-table-column>
      <el-table-column prop="chkRemarks" label="审核意见" width="120">
      </el-table-column>
      <el-table-column prop="chkUser" label="审核人" width="120">
      </el-table-column>
      <el-table-column label="发布状态" width="120">
        <template slot-scope="{ row }">
          {{ pubList[row.publishState] ? pubList[row.publishState].label : '' }}
        </template>
      </el-table-column>
      <el-table-column fixed="right" label="操作" width="200">
        <template slot-scope="{ row }">
          <el-button @click="btnA(row.id)" type="text" size="small"
            >预览</el-button
          >
          <el-button
            @click="
              dialogVisible = true
              form.id = row.id
            "
            :disabled="row.chkState !== 0"
            type="text"
            size="small"
            >审核</el-button
          >
          <el-button
            @click="edit(row)"
            :disabled="row.publishState === 1"
            type="text"
            size="small"
            >修改</el-button
          >
          <el-button @click="pulled(row)" type="text" size="small">
            {{ row.publishState === 1 ? '下架' : '上架' }}
          </el-button>
          <el-button
            @click="del(row)"
            :disabled="row.publishState === 1"
            type="text"
            size="small"
            >删除</el-button
          >
          <el-dialog
            title="题目审核"
            :visible.sync="dialogVisible"
            width="30%"
            append-to-body
          >
            <el-form :model="form" :rules="rules" ref="sform">
              <el-form-item>
                <el-radio v-model="form.chkState" label="1">通过</el-radio>
                <el-radio v-model="form.chkState" label="2">拒绝</el-radio>
              </el-form-item>
              <el-form-item prop="chkRemarks">
                <el-input v-model="form.chkRemarks" type="textarea"></el-input>
              </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
              <el-button @click="dialogVisible = false">取 消</el-button>
              <el-button type="primary" @click="submit()">确 定</el-button>
            </span>
          </el-dialog>
        </template>
      </el-table-column>
    </el-table>
    <quseran
      :showDialog.sync="showDialog"
      :questionsData="questionsData"
    ></quseran>
  </div>
</template>

<script>
import {
  questionType,
  difficulty,
  direction,
  chkType,
  publishType
} from '@/api/hmmm/constants.js'
import {
  choicePublish,
  remove,
  choiceCheck,
  detail
} from '@/api/hmmm/questions.js'
import quseran from '@/module-hmmm/components/questions-preview.vue'
export default {
  components: {
    quseran
  },
  props: {
    newList: {
      type: Array
    }
  },

  methods: {
    handleClick (row) {
      console.log(row)
    },
    /* 获取试题类型 */
    gettypList () {
      this.typList = questionType
    },
    /* 获取试题难度 */
    getdifList () {
      this.difList = difficulty
    },
    /* 获取方向 */
    getdirList () {
      this.dirList = direction
    },
    getchkType () {
      this.chkList = chkType
    },
    getpubList () {
      this.pubList = publishType
    },
    pulled (row) {
      this.$confirm(
        `你确定${
          row.publishState === 1 ? '下架' : '上架'
        }该题目吗？, 是否继续?`,
        '提示',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'danger'
        }
      )
        .then(async () => {
          if (row.publishState === 0) {
            row.publishState = 1
          } else if (row.publishState === 1) {
            row.publishState = 2
          } else if (row.publishState === 2) {
            row.publishState = 1
          }
          const res = await choicePublish({ ...row })
          console.log(res)
        })
        .catch((err) => err)
    },
    del (row) {
      this.$confirm('你确定删除该题目吗？, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'danger'
      })
        .then(async () => {
          row.publishState === 0
            ? (row.publishState = 1)
            : (row.publishState = 2)
          const res = await remove({ ...row })
          this.$emit('reList')
          console.log(res)
        })
        .catch((err) => err)
    },
    submit () {
      /*  const res = await choiceCheck(this.from)
      console.log(res)
      this.dialogVisible = false */
      this.$refs.sform.validate(async (valid) => {
        if (valid) {
          this.form.chkState = Number(this.form.chkState)
          const res = await choiceCheck(this.form)
          console.log(res)
          this.form = {
            chkState: '1',
            chkRemarks: '',
            id: ''
          }
          this.dialogVisible = false
          this.$emit('reList')
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },
    edit (row) {
      this.$router.push({
        path: '/questions/new',
        query: {
          id: row.id
        }
      })
    },
    async btnA (id) {
      const { data } = await detail({ id })
      console.log(data, 123123123)
      this.showDialog = true
      this.questionsData = data
    }
  },
  created () {
    this.getdirList()
    this.getdifList()
    this.gettypList()
    this.getchkType()
    this.getpubList()
  },
  data () {
    return {
      typList: [],
      difList: [],
      dirList: [],
      chkList: [],
      pubList: [],
      dialogVisible: false,
      form: {
        chkState: '1',
        chkRemarks: '',
        id: ''
      },
      questionsData: {},
      showDialog: false,
      rules: {
        chkRemarks: [
          { required: true, message: '请输入审核意见', trigger: 'blur' }
        ]
      }
    }
  }
}
</script>
